<template>
    <div class="room-item">
        <!-- 1.header -->
        <area-header :title="itemdata.title" :subtitle="itemdata.subtitle"></area-header>
        <!-- 2.房间列表 -->
        <div class="room-list">
            <!-- v-for遍历list列表 -->
            <template v-for="item in itemdata.list" :key="itemdata.id">
                <!-- 每个roomitem -->
                <roomitem :roomitemdata="item"></roomitem>
            </template>
        </div>
    </div>
</template>
<script setup>
import AreaHeader from './AreaHeader.vue'
import Roomitem from './Roomitem.vue'
// 父传子 拿到high_score数据
defineProps({
    itemdata: {
        type: Object,
        default:()=>({})
    }
})
</script>
<style scoped lang="less">
.room-list {
        display: flex;
        flex-wrap: wrap;
        margin: 20px -8px;   
    }
</style>